<template v-cloak>
  <view>
    <view class="bar-sticky">
      <navigationBar
        :navigationBarStyle="navigationBarStyle"
        :showBack="true"
      ></navigationBar>
    </view>
    <view class="detail-content">
      <view
        class="cover"
        v-if="examCateItem"
        :style="{ backgroundImage: 'url(' + examCateItem.cover + ')' }"
      ></view>
    </view>
    <ALoading v-show="aloading"></ALoading>
  </view>
</template>

<script>
import ALoading from "../../../../components/loading/loading.vue"
import navigationBar from "../../../../components/navigationBar/navigationBar.vue"
export default {
  components: { navigationBar, ALoading },
  data() {
    return {
      navigationBarStyle: {
        background: "#8486f8",
        iconText: "", //导航栏文字
      },
      examCateItem: {},
      aloading: true,
    }
  },
  onLoad(options) {
    // console.log(options.id)
    this.getItem(options.id)
  },
  methods: {
    getItem(id) {
      let data = {
        id: id,
      }
      this.$store.dispatch("exam/cateItem", data).then(res => {
        this.examCateItem = res
        this.navigationBarStyle.iconText = res.title
        this.aloading = false
      })
    },
  },
}
</script>

<style lang="scss" scoped>
.detail-content {
  margin: 20upx;
  background: #fff;
  padding: 20upx;
  .cover {
    width: 100%;
    height: 40vw;
    background-size: 100% 100%;
    background-repeat: no-repeat;
  }
}
</style>
